import { storeToRefs } from 'pinia'
import UseMask from './src/UseMask.vue'
import UseMasks from './src/UseMasks.vue'

import { useMaskStore } from './src/store'

const store = useMaskStore()

const { bgColor, opacity } = storeToRefs(store)

function setDefaultMaskIndex(index: number) {
  return store.setDefaultMaskIndex(index)
}

function showMask() {
  return store.showMask()
}

function hideMask() {
  return store.hideMask()
}

function toggleMask() {
  return store.toggleMask()
}

function setMaskBgColor(color: string) {
  bgColor.value = color
}

function setMaskOpacity(value: number) {
  opacity.value = value
}

export {
  UseMask,
  UseMasks,
  setDefaultMaskIndex,
  showMask,
  hideMask,
  toggleMask,
  setMaskBgColor,
  setMaskOpacity
}
